.top-bg {
	background: linear-gradient(135deg, #00C6FF 0%, #0072FF 100%);
	height: 64rpx;
}

.content {
	width: 750rpx;
	background: #FFFFFF;
	border-radius: 32rpx 32rpx 0rpx 0rpx;
	margin-top: -28rpx;
	overflow: hidden;
	padding-top: 20rpx;

	.banner {
		height: 272rpx;
		background: linear-gradient(132deg, #3983FF 0%, #0076FF 100%);
		box-shadow: 0rpx 4rpx 16rpx 2rpx rgba(52, 86, 255, 0.78);
		border-radius: 20rpx 72rpx 20rpx 20rpx;
		margin: 32rpx 26rpx;
		font-family: PingFang SC-Semibold, PingFang SC;
		font-weight: 600;
		color: #FFFFFF;
		text-align: center;
		overflow: hidden;
		position: relative;

		.banner-tip {
			font-size: 48rpx;
			margin-top: 58rpx;
			margin-bottom: 18rpx;
		}

		.banner-price {
			font-size: 56rpx;
		}

		.shadow {
			width: 278rpx;
			height: 278rpx;
			background: linear-gradient(132deg, #FFFFFF 0%, #0076FF 100%);
			opacity: 0.12;
			border-radius: 50%;
			position: absolute;
			top: -100rpx;
			right: -100rpx;
		}
	}

	.amount-panel {
		margin: 34rpx 20rpx;

		.amount-title {
			font-size: 32rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: #333333;
			margin-bottom: 30rpx;
			padding: 0 20rpx;
		}

		.amount-list {
			overflow: hidden;

			.amount-item {
				width: 200rpx;
				height: 200rpx;
				background: rgba(255, 255, 255, 0.28);
				box-shadow: 0rpx 4rpx 16rpx 2rpx rgba(0, 0, 0, 0.08);
				border-radius: 10rpx;
				border: 2rpx solid #C1C1C1;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 500;
				color: #848484;
				display: flex;
				align-items: center;
				justify-content: center;
				flex-direction: column;
				float: left;
				margin: 20rpx 17rpx;

				&.active {
					background: rgba(255, 255, 255, 0.28);
					box-shadow: 0rpx 4rpx 16rpx 2rpx rgba(0, 0, 0, 0.08);
					border: 2rpx solid #0F7AFF;
					color: #0072FF;
				}

				.price {
					font-size: 45rpx;
				}

				.discount {
					font-size: 24rpx;
					margin-top: 2rpx;
				}
				.small{
					font-size: 24rpx;
				}
			}
		}
	}

	.mode {
		height: 96rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 4rpx 16rpx 2rpx rgba(0, 0, 0, 0.08);
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		margin: 0 24rpx 10rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 10rpx 20rpx;

		.mode-left {
			display: flex;
			align-items: center;

			.webchat {
				width: 56rpx;
				height: 56rpx;
			}

			.tip {
				font-size: 32rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				color: #333333;
				margin-left: 16rpx;
			}
		}

		.checked {
			width: 36rpx;
			height: 36rpx;
		}
	}

	.pay-btn {
		width: 654rpx;
		height: 92rpx;
		background: linear-gradient(135deg, #00C6FF 0%, #0072FF 100%);
		border-radius: 46rpx 46rpx 46rpx 46rpx;
		opacity: 1;
		margin: 44rpx auto;
		color: #fff;
		text-align: center;
		line-height: 92rpx;
	}
}